<script type="text/javascript">
function camelToUnderScore(form){
	document.getElementById("rightTextArea").value= "";
	submitPost(form, camelCaseCallback);
}

function underScoreToCamelCase(form){
	document.getElementById("leftTextArea").value = "";
	submitPost(form, underScoreCallback);
}

function camelCaseCallback(data){
	//alert(data.output);
	document.getElementById("rightTextArea").value=data.output;
	//$('#rightTextArea').text(data.output);
}
function underScoreCallback(data){
	document.getElementById("leftTextArea").value=data.output;
	//$('#leftTextArea').text(data.output);
}

</script>
<h1>${title}</h1>
<form name="camelCaseForm" action="./camelCase" method="post">
<div id="leftDiv">
	<textarea id="leftTextArea" name="input" cols="40" rows="20"></textarea>
</div>
<div id="buttons">
	<input type="button" name="forward" onClick="camelToUnderScore(document.camelCaseForm)" value="-->" />
	<br>
	<input type="button" name="reverse" onClick="underScoreToCamelCase(document.camelCaseForm)" value="<--" />
</div>
<div id="rightDiv">
	<textarea id="rightTextArea" name="reverse_input" cols="40" rows="20"></textarea>
</div>
</form>